<template>
	<view class="gui-padding">
		
		<gui-page-loading ref="guipageloading">
			<!-- 可以通过插槽添加自定义内容，如 加载提示文本 -->
			<text class="gui-block-text gui-text-small gui-text-center gui-color-gray gui-italic"
				style="padding-top:10rpx;">loading</text>
		</gui-page-loading>
		
		<view class="gui-margin-top-large"></view>
		<form @submit="submit">
			<view>
				<text class="gui-h6 gui-color-gray gui-bold">教练考核申请</text>
			</view>
			
			<view class="gui-form-item gui-border-b">
				<text class="gui-form-label">姓名</text>
				<view class="gui-form-body">
					<input type="text" class="gui-form-input" 
					v-model="realname" name="realname" @input="inputting" placeholder="请输入姓名" />
				</view>
				<text class="gui-form-icon gui-icons gui-text-center gui-color-gray" 
				v-if="realname.length >= 1" @click="clearName2">&#xe78a;</text>
			</view>
			
			<view class="gui-form-item gui-border-b">
				<text class="gui-form-label">手机号</text>
				<view class="gui-form-body">
					<input type="number" class="gui-form-input" 
					v-model="mobile" name="mobile" @input="inputting" placeholder="请输入手机号" />
				</view>
				<text class="gui-form-icon gui-icons gui-text-center gui-color-gray" 
				v-if="mobile.length >= 1" @click="clearName3">&#xe78a;</text>
			</view>
			
			<view class="gui-margin-top">
				<text class="gui-h6 gui-color-gray gui-bold">申请须知</text>
			</view>
			
			<view class="gui-margin-top">
				<text class="gui-h6 gui-color-gray ">{{test_day}}天必须达到{{test_num}}单通过，才能升级助教，如果未达到，{{test_day}}天后将重新计算。</text>
			</view>
			
			
			<view class="gui-margin-top-large gui-flex gui-rows gui-nowrap gui-justify-content-end">
				<button type="default" class="gui-button gui-bg-blue" 
				style="width:200rpx;" formType="submit">
					<text class="gui-icons gui-color-white gui-button-text">开始考试</text>
				</button>
			</view>
			<view style="height:80rpx;"></view>
		</form>
	</view>
</template>
<script>
export default {
	data() {
		return {
			
			realname:'',
			mobile:'',
			test_num:0,
			test_day:0
		}
	},
	onLoad:function(query){
		this.$globalMethod();
		this.user_info();
	},
	methods: {
		user_info(){
			let _this = this;
			_this.$refs.guipageloading.open();
			uni.request({
				url: _this.serverUrl + '/api.user/my_info', //仅为示例，并非真实接口地址。
			
				header: {
					token: _this.token
				},
			
				success: (res) => {
			
					_this.$refs.guipageloading.close();
			
					var return_data = res.data;
			
			
					console.log(return_data);
					if (return_data.code == 0) {
						_this.realname = return_data.data.member_info.realname;
						_this.mobile = return_data.data.member_info.mobile;
						_this.test_num = return_data.data.config.jiaolian_test_num;
						_this.test_day = return_data.data.config.jiaolian_test_day;
			
					}
				}
			});
		},
		// 清空输入框的值
		clearName2 : function () {
			this.realname = '';
		},
		clearName3 : function () {
			this.mobile = '';
		},
		// 监听输入框输入事件
		inputting : function (e) {
			var name2Val = e.detail.value;
			console.log(name2Val);
		},
		// 密码可视 类型切换
		changePwdType : function(){
			this.isPwd = !this.isPwd;
		},
		// picker 切换
		pickerChange : function (e) {
			console.log(e);
			this.genderIndex    = e.detail.value;
			this.formData.name4 = this.gender[this.genderIndex];
		},
		// switch 开关
		switchChange : function (e) {
			this.formData.name6 = e.detail.value;
		},
		// 表单提交
		submit : function (e) {
			// 部分能够获得的表单数据 在 e 对象保存
			// 不支持表单直接获取的数据通过事件记录
			// 最终整理获得完整的表单记录
			var fromData   = e.detail.value;
			
			console.log(fromData);
			
			let _this = this;
			this.graceJS.post(
				this.serverUrl + '/api.teacher/coach_test', fromData, 'json', {
					token: _this.token
				},
				(res) => {
					console.log(res);
					if (res.code == 0) {
						uni.navigateTo({
							url:'/pages/index/player_index',
							success:function(){
								uni.showToast({
									title:res.msg,
									icon:'success'
								});
							}
						})
					}else{
						uni.showToast({
							title:res.msg,
							icon:'error'
						});
					}
					
				},
				(e) => {
					console.log(e);
				}
			);
		}
	}
}
</script>
<style scoped>
.gui-text-small{line-height:50rpx;}
</style>